/**
 * LoadingIndicator 加载指示器组件
 * 统一的加载状态展示
 */

import React from 'react';
import { View, ActivityIndicator, Text, StyleSheet } from 'react-native';
import { COLORS, FONT_SIZE, SPACING } from '../../styles/constants';

/**
 * @param {Object} props
 * @param {string} props.text - 加载提示文字
 * @param {string} props.size - 指示器大小 'small' | 'large'
 * @param {string} props.color - 指示器颜色
 * @param {Object} props.style - 容器样式
 */
export default function LoadingIndicator({
  text = '加载中...',
  size = 'small',
  color = COLORS.primary,
  style,
}) {
  return (
    <View style={[styles.container, style]}>
      <ActivityIndicator size={size} color={color} />
      {text && <Text style={styles.text}>{text}</Text>}
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
    padding: SPACING.xl,
  },

  text: {
    marginTop: SPACING.md,
    fontSize: FONT_SIZE.md,
    color: COLORS.text.quaternary,
  },
});
